<template>
  <!-- 重定价定价任务监控页面 -->
  <div class="rp-monitor">
    <span class="formTitle"
      ><i class="vertical-bar"></i>重定价定价任务监控</span
    >

    <el-form
      :model="monitorForm"
      ref="monitorRef"
      label-width="100px"
      label-position="left"
      size="mini"
    >
      <el-row>
        <el-col :span="5" :offset="2">
          <el-form-item label="重定价编号：" prop="taskCode">
            <el-input
              v-model="monitorForm.taskCode"
              maxlength="32"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5" :offset="2">
          <el-form-item label="重定价名称：" prop="taskName">
            <el-input
              v-model="monitorForm.taskName"
              maxlength="32"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5" :offset="2">
          <el-form-item label="定价编号：" prop="pricingCode">
            <el-input
              v-model="monitorForm.pricingCode"
              maxlength="32"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="5" :offset="2">
          <el-form-item label="开始日期：" prop="taskSd">
            <el-input
              v-model="monitorForm.taskSd"
              maxlength="32"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="5" :offset="2">
          <el-form-item label="结束日期：" prop="taskEd">
            <el-input
              v-model="monitorForm.taskEd"
              maxlength="32"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5" :offset="2">
          <el-form-item label="刷新频率：" prop="refreshRate">
            <el-select
              v-model="monitorForm.refreshRate"
              @change="onChange"
              placeholder="请选择"
            >
              <el-option
                v-for="item in refreshRateOption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-row class="container">
      <el-col style="margin-right: 10px" class="content-left">
        <upper-template :searchIcon="false" :configIcon="false">
          <!-- 操作按钮区 -->
          <template slot="buttonArea">
            <el-button @click="stop()">停止</el-button>
            <el-button @click="resume()">继续</el-button>
            <el-button @click="toResult()">查看结果</el-button>
            <el-button @click="toSubRecord()">子任务</el-button>
            <el-button @click="backIndex">返回</el-button>
          </template>
        </upper-template>
      </el-col>
    </el-row>
    <el-table
      ref="multipleTable"
      :data="tableModelData"
      style="width: 100%"
      @row-click="rowClick"
    >
      <el-table-column
        width="55"
        type="selection"
        
      ></el-table-column>
      <el-table-column
        prop="dataDate"
        label="数据日期"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        prop="pdName"
        label="头寸表"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        prop="finish"
        label="已成功"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        prop="error"
        label="已失败"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        prop="running"
        label="正在定价"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        prop="init"
        label="未开始"
        :show-overflow-tooltip="true"
      ></el-table-column>
    </el-table>
  </div>
</template>
<script>
import { getDict } from "@/api/getDict";
import { pricingTask } from "@/api/index";
export default {
  props: {
    //选中的值
    baseData: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      monitorForm: {
        taskCode: this.baseData.taskCode,
        taskName: this.baseData.taskName,
        pricingCode: this.baseData.pricingCode,
        taskSd: this.baseData.taskSd,
        taskEd: this.baseData.taskEd,
        refreshRate: "10"
      },
      //刷新频率
      timer: null,
      //定价子任务界面
      recordFrom: {},
      subRecordtitleName: "定价子任务",
      //列表数据
      tableModelData: [],
      refreshRateOption: {}
    };
  }, //在父页面是true的情况下在判断
  watch: {
    baseData: {
      handler(newV, oldV) {
        this.monitorForm = {
          taskCode: this.baseData.taskCode,
          taskName: this.baseData.taskName,
          pricingCode: this.baseData.pricingCode,
          taskSd: this.baseData.taskSd,
          taskEd: this.baseData.taskEd,
          refreshRate: "10"
        };
        this.queryCount();
      },
      deep: true,
      immediate: true
    }
  },
  components: {},
  created() {
    this.getRefrshRate("ftp_refresh_rate");
  },
  computed: {},
  mounted() {
    this.monitorForm.refreshRate = "10";
    this.setTimeout(this.monitorForm.refreshRate);
    this.queryCount();
  },
  methods: {
    onChange(val) {
      clearInterval(this.timer);
      this.timer = null;

      let data = this.monitorForm.refreshRate;
      this.setTimeout(data);
    },
    setTimeout(data) {
      console.log();
      this.timer = setInterval(() => {
        this.queryCount();
      }, 1000 * data);
    },
    toSubRecord() {
      // 打开子任务页面，关闭此页面的频率刷新
      clearTimeout(this.timer);
      this.$emit("toSubTasks", this.baseData);
    },
    queryCount() {
      let data = `"${this.monitorForm.pricingCode}"`;
      pricingTask.repricingQueryCount(data).then(res => {
        if (res.code == 200) {
          this.tableModelData = res.datas;
        } else {
          this.$message.error(res.message);
        }
      });
    },
    getRefrshRate(data) {
      getDict(data).then(res => {
        if (res.code == 200) {
          this.refreshRateOption = res.datas;
        } else {
          this.$message.error(res.message);
        }
      });
    },
    backIndex() {
      this.$emit("backIndex");
    },
    resume() {
      let data = {
        taskCode: this.monitorForm.taskCode,
        dataDate: this.monitorForm.dataDate,
      };
      pricingTask.pricingStop(data).then((res) => {
        if (res.code == 200) {
          return this.$message.success("继续定价成功");
        } else {
          return this.$message.warning("联调继续定价失败");
        }
      });
    },
 stop() {
      let data = {
        pricingCode: this.monitorForm.pricingCode,
      };
      pricingTask.repricingStop("'"+this.monitorForm.pricingCode+"'").then((res) => {
        if (res.code == 200) {
          return this.$message.success("停止定价成功");
        } else {
          return this.$message.warning("联调停止定价失败");
        }
      });
    },
    toResult() {
      this.$emit("toResult", this.baseData);
    },
    //点击行选中
    rowClick(row) {
      if (this.$refs.multipleTable) {
        this.$refs.multipleTable.clearSelection();
      }
      this.$refs.multipleTable.toggleRowSelection(row, true);
    }
  },
  beforeDestroy() {
    clearInterval(this.timer);
    this.timer = null;
  }
};
</script>
<style lang="scss" scoped>
.el-col-3 {
  width: 40%;
}
.formTitle {
  font-size: 14px;
  font-weight: 700;
  display: block;
  margin-bottom: 10px;
}
</style>